<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>类别详情页面</title>
    <link rel="stylesheet" href="../css/classification-details.css">
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/common-part.css">
</head>
<body>
      <!-- 头部区域 -->
      <div class="header">
        <div class="header-frist">
            <img src="../image/logo.png" class="header-logo">
        </div>
        <!-- 版心 -->
        <div class="header-c">
            <ul class="header-items">
                <li class="item-list actived"><a  href="#" class="item-link">首页</a></li>
                <li class="item-list left"><a  href="#" class="item-link">女装</a></li>
                <li class="item-list  left"><a href="#"  class="item-link">男装</a></li>
                <li class="item-list left"><a  href="#" class="item-link">箱包</a></li>
                <li class="item-list left"><a  href="#" class="item-link">配饰</a></li>
            </ul>
            <input type="text" class="header-seacher" placeholder="搜索商品名/商品编号">
            <div class="header-right">
                <a href="#" class="right-link"><img src="../image/like.png" class="right-img"></a>
                <a href="#" class="right-link"><img src="../image/shopping.png" class="right-img"></a>
                <a href="#" class="right-link"><img src="../image/person.png" class="right-img"></a>
            </div>
        </div>
    </div>
    <!-- 类别详情页面 -->
    <div class="classification-details">
        <div class="classtitle">
            <span class="title-master">外套&针织衫</span>
            <span class="title-point">&gt;</span>
            <span class="title-sub">休闲外套</span>
        </div>
        <ul class="product-items">
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list margin-left-right">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>  
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list margin-left-right">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li> 
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list margin-left-right">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li> 
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list margin-left-right">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li>
            <li class="item-list">
                <a class="item-link" href="#">
                    <img  class="product-img" src="../image//product-tuijian.png">
                    <p class="product-dc">设计师合作款·千鸟格大衣  冬季上新【羊毛】 </p>
                    <p class="product-sz">【S-XL】</p>
                    <span class="product-preice">¥799</span>
                    <img class="product-islike" src="../image/like.png">
                    <img class="product-cart" src="../image/shopping.png">
                </a>
            </li> 
        </ul>
  
        <div class="btn-group clear">
            <a class="group-link"  href="#">&lt;</a>
            <a class="group-link"  href="#">1</a>
            <a class="group-link"  href="#">...</a>
            <a class="group-link"  href="#">4</a>
            <a  class="group-link" href="#">5</a>
            <a  class="group-link active" href="#">6</a>
            <a class="group-link"  href="#">7</a>
            <a class="group-link"  href="#">8</a>
            <a class="group-link"  href="#">...</a>
            <a  class="group-link" href="#">50</a>
            <a  class="group-link" href="#">&gt;</a>
        </div>
    </div>
</body>
</html>